<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="zh-CN">
	<head>
		<title>管理员主页</title>
		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
    	<meta name="viewport" content="width=device-width, initial-scale=1">
		<meta name="Casper" content="created by 2015?10?22? ??2:17:18">
		<meta name="keywords" content="write something you want">
		<meta name="description" content="write something you want">
		<link href="icon/favico.png" rel="icon">
		<link href="css/bootstrap.css" rel="stylesheet">
	</head>
	<body>
		 <nav class="navbar navbar-inverse navbar-fixed-top">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="">论坛后台管理</a>
        </div>
        <div id="navbar" class="navbar-collapse collapse">
          <form class="navbar-form navbar-right">
            <div class="form-group">
            	<button type="submit" class="btn btn-success">${user.email }</button>
            </div>
            <button type="submit" class="btn btn-success">注销</button>
          </form>
        </div><!--/.navbar-collapse -->
      </div>
    </nav>

    <!-- Main jumbotron for a primary marketing message or call to action -->
    <div class="jumbotron">
      <div class="container">
        <h3>公告信息</h3>
        <p>你有5个版主申请需要，需要审核</p>
      </div>
    </div>
    <div class="container">
      <div class="row">
        	<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#addBoardModal">添加版块</button>
        	<button type="button" class="btn btn-primary">版主审核</button>
        	<button type="button" class="btn btn-primary">发布公告</button>
        	<div>
        		<table class="table table-bordered">
				<tr>
					<th>父版块id</th>
					<th>版块id</th>
					<th>版块名字</th>
					<th>版块描述</th>
					<th>添加时间</th>
					<th>删除</th>
				</tr>
				<c:forEach items="${boards }" var="b">
					<tr>
						<td>${b.pbid }</td>
						<td>${b.id }</td>
						<td>${b.boardName }</td>
						<td>${b.boardDesc }</td>
						<td>${b.addTime }</td>
						<td><button type="button" class="btn btn-danger">删除</button></td>
					</tr>
				</c:forEach>
			</table>
        	</div>
      </div>
      <hr>
      <footer>
        <p>©Casper by 2015</p>
      </footer>
    </div> <!-- /container -->
		
	<!-- 添加版块Modal -->
		<div class="modal fade" id="addBoardModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
		  <div class="modal-dialog" role="document">
		    <div class="modal-content">
		      <div class="modal-header">
		        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
		        <h4 class="modal-title" id="myModalLabel">添加版块</h4>
		      </div>
		      <div class="modal-body">
					<form class="form-horizontal" name="addBoardForm" action="BoardServlet?op=addBoard" method="post">
					  <div class="form-group">
					  	<label for="selectBoard" class="col-sm-2 control-label">版块</label>
					  	<div class="col-sm-10">
					  		<select id="selectBoard" name="pbid" class="form-control">
							  <option value="0">添加父版块</option>
							  <c:forEach items="${pboards }" var="pb">
							  		<option value="${pb.id}">${pb.boardName }</option>
							  </c:forEach>
							</select>
					  	</div>
					  </div>
					  <div class="form-group">
					  	<label for="inputBoardName" class="col-sm-2 control-label">版块名字</label>
					    <div class="col-sm-10">
					      	<input type="text" name="boardname" class="form-control" id="inputBoardName" placeholder="请输入版块的名字" onblur="checkBoardName()">
					    </div>
					  </div>
					  <div class="form-group">
					    <label for="inputPassword3" class="col-sm-2 control-label">版块描述</label>
					    <div class="col-sm-10">
					      <input type="text" name="boarddesc" class="form-control" id="inputPassword3" placeholder="请输入版块描述">
					    </div>
					  </div>
				 	</form>
		      </div>
		      <div class="modal-footer">
		      <span id="tips" style="color: red;font-size: 25;"></span>
		        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
		        <button type="button" class="btn btn-primary" onclick="submitAddBoard()">确认添加</button>
		      </div>
		    </div>
		  </div>
		</div>
		<script type="text/javascript">
			function submitAddBoard(){
				document.addBoardForm.submit();
			}
			function checkBoardName(){
				var boardName = document.getElementById("inputBoardName").value;
				$.ajax({
					url:'BoardServlet?op=checkBoardNameOnly',
					type:'post',
					data:{'boardName':boardName},
					success:function(data){
						document.getElementById('tips').innerHTML= data;				
					}
				});
			
			}
		
		</script>
		<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
		<script type="text/javascript" src="js/bootstrap.min.js"></script>
	</body>
</html>